<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <script>

    //拦截请求的
    axios.interceptors.request.use(function (config) {
      console.log("请求发出前，执行的方法")
      return config;
    }, function (error) {
      return Promise.reject(error);
    });

    //拦截响应的
    axios.interceptors.response.use(function (response) {
      //console.log("请求成功后第一个调用的方法")
      console.log(response.headers) //response里面的属性
      const { authorization } = response.headers
      //存储  判断authorization为真的话，就进行存储
      console.log(authorization);
      authorization && localStorage.setItem("token", authorization)
      return response;
    }, function (error) {
      return Promise.reject(error);
    });
  </script>
</head>

<body>
  <h1>创作者登录页</h1>
  <input type="text" id="username">
  <input type="text" id="password">
  <button id="login">登录</button>

  <script>
    const username = document.getElementById("username")
    const password = document.getElementById("password")
    const login = document.getElementById("login")

    login.onclick = function () {
      axios.post("http://localhost:3000/api/user/login", {
        username: username.value,
        password: password.value,
      }).then(res => {
        console.log(res.data);
        if (res.data.code === 200) {
          location.href = "./author-center/author-center.html"
          localStorage.setItem("token", res.data.token)
          localStorage.userinfo = JSON.stringify(res.data.data)
        } else {
          alert(res.data.msg)
        }
      })
    }
  </script>
</body>

</html>